/* ***************************
* 数据图表操作界面JS
* @Editer wangjunfu
* ****************************/

// 监听DIV大小变化
(function ($, h, c) {
    var a = $([]),
        e = $.resize = $.extend($.resize, {}),
        i,
        k = "setTimeout",
        j = "resize",
        d = j + "-special-event",
        b = "delay",
        f = "throttleWindow";
    e[b] = 250;
    e[f] = true;
    $.event.special[j] = {
        setup: function () {
            if (!e[f] && this[k]) {
                return false;
            }
            var l = $(this);
            a = a.add(l);
            $.data(this, d, {
                w: l.width(),
                h: l.height()
            });
            if (a.length === 1) {
                g();
            }
        },
        teardown: function () {
            if (!e[f] && this[k]) {
                return false;
            }
            var l = $(this);
            a = a.not(l);
            l.removeData(d);
            if (!a.length) {
                clearTimeout(i);
            }
        },
        add: function (l) {
            if (!e[f] && this[k]) {
                return false;
            }
            var n;

            function m(s, o, p) {
                var q = $(this),
                    r = $.data(this, d);
                if (r) {
                    r.w = o != c ? o : q.width();
                    r.h = p != c ? p : q.height();
                    n.apply(this, arguments);
                }
            }

            if ($.isFunction(l)) {
                n = l;
                return m;
            } else {
                n = l.handler;
                l.handler = m;
            }
        }
    };

    function g() {
        i = h[k](function () {
                a.each(function () {
                    var n = $(this),
                        m = n.width(),
                        l = n.height(),
                        o = $.data(this, d);
                    if (m != o.w || l != o.h) {
                        n.trigger(j, [o.w = m, o.h = l]);
                    }
                });
                g();
            },
            e[b]);
    }
})(jQuery, this);

//所有图表
window.page_charts_array = [];

//浏览器窗口变动 重新调整图表大小
window.onresize = function () {
    resizeAllCharts();
};

function resizeAllCharts() {
    for (i in window.page_charts_array) {
        var chart = window.page_charts_array[i];
        if (typeof(chart.resize) == "function") {
            chart.resize();
        }
    }
}

var current_chart; //当前图表

$(function () {
    //帮助提示
    var placementRight = 'right';
    var placementLeft = 'left';

    // Define the tour!
    var tour = {
        id: "my-intro",
        steps: [
            {
                target: "sidebar-menu",
                title: "导航菜单",
                content: "数据分析菜单导航区域。",
                placement: placementRight,
                yOffset: 10
            },
            {
                target: 'analysis-panel',
                title: "可视化编辑",
                content: "在此处创建数据图表和设置数据图表数据及样式。",
                placement: placementLeft,
                zindex: 999
            },
            {
                target: 'widget-chart-container',
                title: "数据展示区域",
                content: "新建的数据图表在此处展示，点击一个图表可以在分析面板区域重新编辑图表数据和样式。",
                placement: placementRight,
                zindex: 999
            },
            {
                target: 'analysis-metainfo',
                title: "元数据信息区域",
                content: "此处为操作表的元数据信息，元数据列信息可以拖拽到分析面板中的数据tab中的分析字段区域进行数据分析。",
                placement: placementLeft,
                zindex: 999
            }
        ],
        showPrevButton: true
    };
    // Start the tour!
    hopscotch.startTour(tour);

    //图表区域大小修改 图表也进行重绘
    $("#widget-chart-container").resize(function () {
        //此事件会触发window.onresize
    });

    //图表拖拽排序
    $("#widget-chart-container").sortable({
        revert: true,
        stop: function () {
            //判断是否以保存主表信息
            var chartid = $("#chartid").val();
            if (chartid) {
                //更新图表顺序
                $("#widget-chart-container").find("div[name=chart_model_div]").each(function (i, div) {
                    var chartstyle = $(div).data("chartstyle");
                    if (chartstyle.index !== i) {    //顺序有变化放入需要更新列表中
                        chartstyle.index = i;
                        updateChartInfo(chartstyle);
                        $(div).data("chartstyle", chartstyle);
                    }
                });
            }
        }
    });

    //初始化加载的图表功能
    $("#widget-chart-container").find("div[name=chart_model_div]").each(function (i, div) {

        //添加缩放功能
        addResizable(div);
        //点击事件添加
        addClickEvent(div);
        //加载数据
        var chartstyle = $(div).data("chartstyle");

        var sourceId = $("#sourceId").val();
        var size = 1000;
        var chart_type = chartstyle.type;
        var chart_doubleY = chartstyle.doubleY;
        var statsfields = $(div).data("statsfields");
        var groupfields = $(div).data("groupfields");
        var legendfields = $(div).data("legendfields");
        var filterfields = $(div).data("filterfields");
        var statsjson_str = JSON.stringify(statsfields);
        var groupjson_str = JSON.stringify(groupfields);
        var legendjson_str = JSON.stringify(legendfields);
        var filterjson_str = JSON.stringify(filterfields);
        //var formatjson_str = chartstyle.formatfields;
        var chart = echarts.init($(div).find("div[name=chartdiv]").get(0));
        page_charts_array.push(chart);

        if (statsfields && statsfields.length > 0) {
            var postData = {
                sourceId: sourceId,
                composeId: sourceId,
                page: 1,
                pageSize: size,
                doubleY: chart_doubleY,
                chartType: chart_type,
                statsjson: statsjson_str,
                groupjson: groupjson_str,
                legendjson: legendjson_str,
                fliterjson: filterjson_str
                //formatjson: formatjson_str
            };

            chart.showLoading();

            // 区分"数据图表"还是"高级图表"
            var url = "/analysis/composechart/execChartQuery";
            if ($("input[name='submitChartType']").val() == 1){
                url = "/analysis/charts/execChartQuery";
            }

            ajax({
                url: url,
                data: postData,
                success: function (result) {
                    if (result.returnCode == 1) {
                        var page = result.page;
                        var rows = page.items;
                        if (rows.length > 0) {
                            //数据信息
                            var chartinfo = result.chartinfo;
                            var chart_option = lineChartOptions();
                            switch (chartstyle.type) {
                                case 0:
                                    chart_option = lineChartOptions();
                                    break;
                                case 1:
                                    chart_option = barChartOption();
                                    break;
                                case 2:
                                    chart_option = pieChartOption();
                                    break;
                                case 3:
                                    chart_option = mapChartOption();
                                    break;
                                case 4://漏斗图
                                    chart_option = funnelChartOption();
                                    break;
                                case 5:
                                    chart_option = doughnutChartOption();
                                    break;
                                case 6:
                                    chart_option = nightingaleRoseChartOption();
                                    break;
                                case 7:
                                    chart_option = gaugeChartOption();
                                    break;
                                case 8:
                                    chart_option = scatterChartOption();
                                    break;
                                default:
                                    chart_option = lineChartOptions();
                                    break;
                            }

                            chart_option.series = addSeriesDefaultOption(chartinfo.series, chartstyle.type);
                            if (chartstyle.type !== 7) {
                                chart_option.legend.data = chartinfo.legend;
                            }

                            if (chartstyle.type === 3) {
                                //chart_option.dataRange = '{"min":0,"color":["#6664EC","#C5C5FF"],"top":"bottom","max":100000000,"left":"left","calculable":true,"text":["高","低"]}';
                                chart_option.dataRange = chartinfo.visualMaps;
                            }

                            if (chartstyle.type === 0 || chartstyle.type === 1) {//线图和柱图
                                var xaxis = chartinfo.xAxis;
                                chart_option.grid = {};
                                chart_option.grid.top = '12%';
                                chart_option.grid.left = '1%';
                                chart_option.grid.right = '10%';
                                chart_option.grid.containLabel = true;

                                //判断是纵向还是横向
                                if (chartstyle.orient === 1) {//横向
                                    chart_option.xAxis.data = xaxis;

                                    //饼图和柱图判断是否双Y轴
                                    if (chartstyle.doubleY === 1) {//双Y轴
                                        chart_option.yAxis = [{type: 'value'}, {type: 'value'}];
                                    } else {
                                        chart_option.yAxis = [{type: 'value'}];
                                    }
                                } else {
                                    chart_option.xAxis = {type: 'value'};
                                    chart_option.yAxis = {
                                        type: 'category',
                                        boundaryGap: false,
                                        data: xaxis
                                    };
                                }
                            }

                            if (chartstyle.type !== 7) {
                                var p = chartstyle.legend_position;
                                var legend_option = {
                                    orient: 'horizontal',
                                    top: '',
                                    bottom: 'bottom',
                                    left: '',
                                    right: ''
                                };
                                switch (p) {
                                    case "top":
                                        legend_option = {
                                            orient: 'horizontal',
                                            top: 'top',
                                            bottom: 'auto',
                                            left: 'center',
                                            right: 'auto'
                                        };
                                        break;
                                    case "bottom":
                                        legend_option = {
                                            orient: 'horizontal',
                                            top: 'auto',
                                            bottom: 'bottom',
                                            left: 'center',
                                            right: 'auto'
                                        };
                                        break;
                                    case "left":
                                        legend_option = {
                                            orient: 'vertical',
                                            top: 'auto',
                                            bottom: 'center',
                                            left: 'left',
                                            right: 'auto'
                                        };
                                        break;
                                    case "right":
                                        legend_option = {
                                            orient: 'vertical',
                                            top: 'auto',
                                            bottom: 'center',
                                            left: 'auto',
                                            right: 'right'
                                        };
                                        break;
                                }
                                chart_option.legend.orient = legend_option.orient;
                                chart_option.legend.top = legend_option.top;
                                chart_option.legend.bottom = legend_option.bottom;
                                chart_option.legend.left = legend_option.left;
                                chart_option.legend.right = legend_option.right;

                                if (chartstyle.is_show_legend === 0) {
                                    chart_option.legend.show = false;
                                }
                            }

                            if (chartstyle.is_show_tips === 0) {
                                chart_option.tooltip.show = false;
                            }
                            chart.setOption(chart_option);
                            chart.hideLoading();
                        } else {
                            return showInfoAlert("没有查询到记录！");
                        }
                    }
                }
            });
        } else {
            var chart_option = lineChartOptions();
            switch (chartstyle.type) {
                case 0:
                    chart_option = lineChartOptions();
                    break;
                case 1:
                    chart_option = barChartOption();
                    break;
                case 2:
                    chart_option = pieChartOption();
                    break;
                case 3:
                    chart_option = mapChartOption();
                    break;
                case 4:// 漏斗图
                    chart_option = funnelChartOption();
                    break;
                case 5:
                    chart_option = doughnutChartOption();
                    break;
                case 6:
                    chart_option = nightingaleRoseChartOption();
                    break;
                case 7:
                    chart_option = gaugeChartOption();
                    break;
                case 8:
                    chart_option = scatterChartOption();
                    break;
                default:
                    chart_option = lineChartOptions();
                    break;
            }
            chart.setOption(chart_option);
            chart.hideLoading();
        }
    });

    //选择图表区域隐藏显示切换
    $("#data-charts-show-btn").click(function () {
        $("#data-charts-ul").toggle();
        var vb = $("#data-charts-ul:visible");
        var icon = $("#data-charts-show-btn").find("span");

        if (vb.length > 0) {
            icon.removeClass("icon-arrow-d");
            icon.addClass("icon-arrow-u");
        } else {
            icon.removeClass("icon-arrow-u");
            icon.addClass("icon-arrow-d");
        }

    });

    //选择组件区域隐藏显示切换
    $("#control-item-show-btn").click(function () {
        $("#control-item-ul").toggle();
        var vb = $("#control-item-ul:visible");
        var icon = $("#control-item-show-btn").find("span");

        if (vb.length > 0) {
            icon.removeClass("icon-arrow-d");
            icon.addClass("icon-arrow-u");
        } else {
            icon.removeClass("icon-arrow-u");
            icon.addClass("icon-arrow-d");
        }

    });

    //名称修改后修改对应隐藏名称
    $("#query_name_input").change(function () {
        var newname = $(this).val();
        if (newname === "") {
            return showInfoAlert("数据图表名称不能为空！");
        }
        $("#chartname").val(newname);
    });

    //统计字段区域
    $("#droppable_statsfields").droppable({
        activeClass: "ui-state-default",
        hoverClass: "ui-state-hover",
        drop: function (event, ui) {
            var field_a = $(ui.draggable);
            var name = field_a.data("fname");
            var namecn = field_a.data("fnamecn");
            var type = field_a.data("ftype");
            if (type === 'filter') {
                return showInfoAlert("过滤条件类型列不能作为统计字段！");
            }
            var field = {};
            field.colName = name;
            field.colNameCn = namecn;
            field.colType = type;
            field.stack = name;
            field.isLabelShowed = "false";
            field.labelRotate = 0;
            field.labelDistance = 0;
            field.scatterCharacter = "";
            field.scatterMatchName = name;
            createStatsColumn(field);
        }
    });

    //分组字段区域
    $("#droppable_groupfields").droppable({
        activeClass: "ui-state-default",
        hoverClass: "ui-state-hover",
        drop: function (event, ui) {
            var field_a = $(ui.draggable);
            var name = field_a.data("fname");
            var namecn = field_a.data("fnamecn");
            var type = field_a.data("ftype");
            var interval = field_a.data("datetype");
            if (type === 'filter') {
                return showInfoAlert("过滤条件类型列不能作为分组字段！");
            }
            var field = {};
            if (interval) {
                field.colName = name;
                var suffix = "";
                switch (interval) {
                    case "year":
                        suffix = "年份";
                        break;
                    case "month":
                        suffix = "月份";
                        break;
                    case "week":
                        suffix = "周";
                        break;
                }
                field.colNameCn = namecn + suffix;
                field.colType = type;
                field.interval = interval;
            } else {
                field.colName = name;
                field.colNameCn = namecn;
                field.colType = type;
            }
            //field.paramsField = [];   //undefined 的时候会过滤掉
            createGroupColumn(field);
        }
    });

    //图例字段区域
    $("#droppable_legendfields").droppable({
        activeClass: "ui-state-default",
        hoverClass: "ui-state-hover",
        drop: function (event, ui) {
            var field_a = $(ui.draggable);
            var name = field_a.data("fname");
            var namecn = field_a.data("fnamecn");
            var type = field_a.data("ftype");
            if (type === 'filter') {
                return showInfoAlert("过滤条件类型列不能作为图例字段！");
            }
            var interval = field_a.data("datetype");
            var field = {};
            if (interval) {
                field.colName = name;
                var suffix = "";
                switch (interval) {
                    case "year":
                        suffix = "年份";
                        break;
                    case "month":
                        suffix = "月份";
                        break;
                    case "week":
                        suffix = "周";
                        break;
                }
                field.colNameCn = namecn + suffix;
                field.colType = type;
                field.interval = interval;
            } else {
                field.colName = name;
                field.colNameCn = namecn;
                field.colType = type;
            }
            createLegendColumn(field);
        }
    });

    //可视化编辑 图表样式布局操作 --- start ---
    //图表名称修改后 修改对应的图表名称
    $("#chart_title").change(function () {
        var chart_model_div = $("#widget-chart-container").find(".select_chart_div");
        var new_title = $(this).val();
        chart_model_div.find("h3[name=chart_title]").text(new_title);
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.title = new_title;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
    });

    //是否显示标题
    $("#style_show_title").change(function () {
        var isChecked = $(this)[0].checked;
        var nv = 0;
        var chart_model_div = $("#widget-chart-container").find(".select_chart_div");
        if (isChecked) {
            nv = 1;
            $("#widget-chart-container").find(".select_chart_div").find("h3[name=chart_title]").show();
        } else {
            $("#widget-chart-container").find(".select_chart_div").find("h3[name=chart_title]").hide();
        }
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.is_show_title = nv;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
    });

    //图表横向竖向切换
    $("#style_orient").change(function () {
        var isChecked = $(this)[0].checked;
        var coption = current_chart.getOption();
        var y_set = coption.yAxis;
        var x_set = coption.xAxis;
        current_chart.setOption({
            xAxis: y_set,
            yAxis: x_set
        });
        var nv = 0;
        if (isChecked) {
            nv = 0;
        } else {
            nv = 1;
        }
        var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.orient = nv;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
    });

    //宽度修改
    $("#chart_modal_width").change(function () {
        // 图表框宽度修改
        var c_width = $(this).val();
        var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.width = c_width;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
        chart_model_div.css("width", "");
        chart_model_div.attr("class", "portlet " + c_width);
        current_chart.resize();
    });

    //高度修改
    $("#chart_modal_height").change(function () {
        // 图表框高度修改
        var c_height = $(this).val();
        if (c_height < 250) {
            return showInfoAlert("图表高度不能小于250px");
        }
        var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.height = c_height;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
        chart_model_div.css("height", c_height);
        current_chart.resize();
    });

    //双Y轴显示切换
    $("#style_doubleY").change(function () {
        var isChecked = $(this)[0].checked;
        var coption = current_chart.getOption();
        var y_set = coption.yAxis;

        //检查当前Y轴是不是value轴
        var type = y_set[0].type;
        if (type != "value") {
            y_set = coption.xAxis;
        }
        if (isChecked) {
            if (y_set.length === 1) {
                y_set.push({
                    type: 'value'
                });
            }
        } else {
            if (y_set.length === 2) {
                y_set.pop(); //删除后边的轴
            }
        }
        if (type != "value") {
            coption.xAxis = y_set;
        } else {
            coption.yAxis = y_set;
        }
        current_chart.setOption(coption, true);
        var nv = 0;
        if (isChecked) {
            nv = 1;
        } else {
            nv = 0;
        }
        var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.doubleY = nv;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
    });

    //曲线
    $("#style_graph").change(function () {
        var isChecked = $(this)[0].checked;
        var series = current_chart.getOption().series;
        if (isChecked) {
            current_chart.setOption({
                series: {
                    smooth: true
                }
            });
        } else {
            current_chart.setOption({
                series: {
                    smooth: false
                }
            });
        }
        var nv = 0;
        if (isChecked) {
            nv = 1;
        } else {
            nv = 0;
        }
        var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.graph = nv;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
    });

    //显示图例
    $("#style_show_legend").change(function () {
        var isChecked = $(this)[0].checked;
        if (isChecked) {
            current_chart.setOption({
                legend: {
                    show: true
                }
            });
        } else {
            current_chart.setOption({
                legend: {
                    show: false
                }
            });
        }
        var nv = 0;
        if (isChecked) {
            nv = 1;
        } else {
            nv = 0;
        }
        var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.is_show_legend = nv;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
    });

    //图例位置
    $("#legend_position").change(function () {
        var p = $(this).val();
        var legend_option = {
            orient: 'horizontal',
            top: '',
            bottom: 'bottom',
            left: '',
            right: ''
        };
        switch (p) {
            case "top":
                legend_option = {
                    orient: 'horizontal',
                    top: 'top',
                    bottom: 'auto',
                    left: 'center',
                    right: 'auto'
                };
                break;
            case "bottom":
                legend_option = {
                    orient: 'horizontal',
                    top: 'auto',
                    bottom: 'bottom',
                    left: 'center',
                    right: 'auto'
                };
                break;
            case "left":
                legend_option = {
                    orient: 'vertical',
                    top: 'auto',
                    bottom: 'center',
                    left: 'left',
                    right: 'auto'
                };
                break;
            case "right":
                legend_option = {
                    orient: 'vertical',
                    top: 'auto',
                    bottom: 'center',
                    left: 'auto',
                    right: 'right'
                };
                break;
        }
        current_chart.setOption({
            legend: legend_option
        });
        var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.legend_position = p;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
    });

    //显示tips
    $("#style_show_tips").change(function () {
        var isChecked = $(this)[0].checked;
        if (isChecked) {
            current_chart.setOption({
                tooltip: {
                    show: true
                }
            });
        } else {
            current_chart.setOption({
                tooltip: {
                    show: false
                }
            });
        }
        var nv = 0;
        if (isChecked) {
            nv = 1;
        } else {
            nv = 0;
        }
        var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
        var chartstyle = chart_model_div.data("chartstyle");
        chartstyle.is_show_tips = nv;
        chart_model_div.data("chartstyle", chartstyle);
        updateChartInfo(chartstyle); //更新数据库
    });

    //可视化编辑 图表样式布局操作 --- end ---
});

/**
 * 初始化样式
 * @param style
 */
function intiStyle(style) {
    if (style) {
        if (style.width) {
            $("#chart_modal_width").val(style.width);
        }
        if (style.height) {
            $("#chart_modal_height").val(style.height);
        }
        if (style.type === 2 || style.type === 4 || style.type === 5 || style.type === 6 || style.type === 7) { //饼图、漏斗图隐藏图例字段 和布局中的横向
            $("#layout_orient").hide();
            $("#droppable_legendfields").hide();
            $("#layout_doubleY").hide();
        } else {
            $("#layout_orient").show();
            $("#droppable_legendfields").show();
            $("#layout_doubleY").show();
        }
        if (style.type) {
            $("#charttype").val(style.type);
        } else {
            $("#charttype").val(0);
        }
        if (style.title) {
            $("#chart_title").val(style.title);
        } else {
            $("#chart_title").val("请输入图表名称...");
        }
        if (style.is_show_title === 1) {
            $("#style_show_title").get(0).checked = true;
        } else {
            $("#style_show_title").get(0).checked = false;
        }
        if (style.orient === 1) {
            $("#style_orient").get(0).checked = true;
        } else {
            $("#style_orient").get(0).checked = false;
        }
        if (style.doubleY === 1) {
            $("#style_doubleY").get(0).checked = true;
        } else {
            $("#style_doubleY").get(0).checked = false;
        }
        //if(style.graph == 1){
        //    $("#style_graph").get(0).checked = true;
        //}else{
        //    $("#style_graph").get(0).checked = false;
        //}
        if (style.is_show_legend === 1) {
            $("#style_show_legend").get(0).checked = true;
        } else {
            $("#style_show_legend").get(0).checked = false;
        }
        if (style.legend_position) {
            $("#legend_position").val(style.legend_position);
        } else {
            $("#legend_position").val("top");
        }
        if (style.is_show_tips === 1) {
            $("#style_show_tips").get(0).checked = true;
        } else {
            $("#style_show_tips").get(0).checked = false;
        }
        if (style.specialAttribute) {
            $("#specialAttribute").val(style.specialAttribute);
        } else {
            $("#specialAttribute").val("");
        }
        //if (style.formatfields) {
        //    $("#formatfields").val(style.formatfields);
        //} else {
        //    $("#formatfields").val("");
        //}
    } else {
        $("#chart_title").val("请输入图表名称...");
        $("#style_show_title").get(0).checked = true;
        $("#style_orient").get(0).checked = true;
        $("#style_doubleY").get(0).checked = false;
        $("#style_show_legend").get(0).checked = true;
        $("#legend_position").val("top");
        $("#style_show_tips").get(0).checked = true;
        $("#specialAttribute").val("");
        //$("#style_graph").get(0).checked = false;
    }
}

/**
 * 创建统计字段Dom
 */
var _serie_type_edit_li;    //当前要修改样式的统计字段
function createStatsColumn(f) {
    var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
    var chartstyle = chart_model_div.data("chartstyle");
    var stats = $("#area_value").find("li[name=statsfiled]");
    var legends = $("#area_legend").find("li[name=legendfiled]");
    var groups = $("#area_group").find("li[name=groupfiled]");
    //当图表为pie时 只能有一个Group字段和统计字段
    if (chartstyle.type === 2|| chartstyle.type === 3 || chartstyle.type === 5  || chartstyle.type === 6 || chartstyle.type === 7) {
        if (stats.length >= 1 && chartstyle.type === 2) {
            return showInfoAlert("饼图只能有一个统计字段！");
        }
        if (stats.length >= 1 && chartstyle.type === 3) {
            return showInfoAlert("Map图只能有一个统计字段！");
        }
        if (stats.length >= 1 && chartstyle.type === 5) {
            return showInfoAlert("环形图只能有一个统计字段！");
        }
        if (stats.length >= 1 && chartstyle.type === 6) {
            return showInfoAlert("南丁格尔玫瑰图图只能有一个统计字段！");
        }
        if (stats.length >= 1 && chartstyle.type === 7) {
            return showInfoAlert("仪表盘只能有一个统计字段！");
        }
    } else if (chartstyle.type === 4) {//当为漏斗图时 可以有一个Group字段和一个统计字段 或者多个统计字段，没有group字段
        if (groups.length > 1) {
            return showInfoAlert("漏斗图只能有一个分组字段！");
        }
        if (groups.length === 1 && stats.length > 1) {
            return showInfoAlert("漏斗图存在分组字段时，只能有一个统计字段！");
        }
    } else {
        //当图例字段不为空时 统计字段只能有一个
        if (legends.length > 0 && stats.length > 0) {
            return showInfoAlert("有图例字段时统计字段只能有一个！");
        }
    }

    var li = $('<li name="statsfiled" class="column-item column-measure" >');
    var icon_class = "string_ico_docu";
    switch (f.colType) {
        case "string":
            break;
        case "date":
        case "time":
            icon_class = "datetime_ico_docu";
            break;
        case "numeric":
            icon_class = "number_ico_docu";
            break;
        default:
            break;
    }

    var li_icon = $('<span  class="button ' + icon_class + '"></span>');
    var li_ul = $('<ul class="kui-list aggregate-list" style="display: none;">');
    var agg_icon = "icon-sum";
    var agg_type = "sum";
    if (f.colType === "numeric") {
        li_ul.append('<li class="kui-list-item" data-aggtype="sum"><span class="iconfont icon-sum"></span><span class="aggregate-text">求和</span></li>\n'
            + '<li data-aggtype="count" class="kui-list-item"><span class="iconfont icon-count"></span><span class="aggregate-text">计数</span></li>\n'
            + '<li data-aggtype="min" class="kui-list-item"><span class="iconfont icon-min"></span><span class="aggregate-text">最小值</span></li>\n'
            + '<li data-aggtype="max" class="kui-list-item"><span class="iconfont icon-max"></span><span class="aggregate-text">最大值</span></li>\n'
            + '<li data-aggtype="avg" class="kui-list-item"><span class="iconfont icon-avg"></span><span class="aggregate-text">平均值</span></li>');
    } else {
        agg_icon = "icon-count";
        agg_type = "count";
        li_ul.append('<li data-aggtype="count" class="kui-list-item"><span class="iconfont icon-count"></span><span class="aggregate-text">计数</span></li>\n'
            + '<li data-aggtype="min" class="kui-list-item"><span class="iconfont icon-min"></span><span class="aggregate-text">最小值</span></li>\n'
            + '<li data-aggtype="max" class="kui-list-item"><span class="iconfont icon-max"></span><span class="aggregate-text">最大值</span></li>\n'
            + '<li data-aggtype="distinctcount" class="kui-list-item"><span class="iconfont icon-countd"></span><span class="aggregate-text">计数（去重）</span></li>\n'
            + '');
    }

    if (f.aggtype) {
        agg_type = f.aggtype;
        switch (f.aggtype) {
            case "sum":
                agg_icon = "icon-sum";
                break;
            case "avg":
                agg_icon = "icon-avg";
                break;
            case "max":
                agg_icon = "icon-max";
                break;
            case "min":
                agg_icon = "icon-min";
                break;
            case "count":
                agg_icon = "icon-count";
                break;
            case "distinctcount":
                agg_icon = "icon-countd";
                break;
        }
    }

    var li_agg_icon = $('<span name="aggtypeicon" class="iconfont ' + agg_icon + ' icon-aggregate"></span>');
    var li_field = $('<span class="data-item" style="width: 0px;" title="' + f.colName + '(' + f.colNameCn + ')">' + f.colName + '</span>');
    var li_showname = $('<span class="data-item" style="width: 160px;margin-left: 1px;" ><input class="query-input" name="statsnames" value="' + f.colNameCn + '" type="text" style="height: 16px;width: 100px;" ></span>');
    var li_add_compute = $('<span title="添加计算字段" style="position: inherit;margin-right: 2px" class="button calc_ico_docu pull-right" ></span>');
    var li_del = $('<span title="移除统计字段" class="iconfont icon-remove pull-right"></span>');

    li_add_compute.click(function () {
        // 打开计算字段选择
        _compute_stats_li = $(this).closest("li[name=statsfiled]");
        var method = _compute_stats_li.find("input[name=com_method]").val();
        var agg = _compute_stats_li.find("input[name=com_agg]").val();
        var fname = _compute_stats_li.find("input[name=com_fname]").val();

        if (method !== "") {
            $("#compute_method_select").val(method);
            $("#compute_agg_select").val(agg);
            $("#compute_field_select").val(fname);
        }
        $("#addComputeField").modal("show");
    });

    var yIdx = 0; //Y1 Y2轴
    if (f.yIndex) {
        yIdx = f.yIndex;
    }

    var initType; //拆线图还是柱图
    if (!f.chartType) {
        if (chartstyle.type === 1) {
            initType = "bar";
        } else if (chartstyle.type === 0) {
            initType = "line";
        } else {
            initType = -9999 //其它图表
        }
    } else {
        initType = f.chartType;
    }

    if(chartstyle.type !== 0 && chartstyle.type !== 1){
        initType = "other";
    }
    if (chartstyle.type === 8){
        initType = "scatter";
    }

    var labShow = false;
    if (f.isLabelShowed){
        labShow = f.isLabelShowed;
    }

    var li_edit_serie_type = $('<span title="设置图表样式" style="font-size: 12px; margin-right: 2px;" class="iconfont icon-setup pull-right"></span>');
    li_edit_serie_type.click(function () {

        //打开字段样式选择（弹出Tab）
        _serie_type_edit_li = $(this).closest("li[name=statsfiled]");   //拖拽到过滤条件处
        var type = _serie_type_edit_li.find("input[name=statscharttype]").val();
        var value_axis = _serie_type_edit_li.find("input[name=statsyindex]").val();
        var label_show = _serie_type_edit_li.find("input[name=statsshowlabel]").val();
        var stack_name = _serie_type_edit_li.find("input[name=statsstack]").val();
        if (stack_name === "" || stack_name === "undefined") {
            stack_name = f.colName;
        }
        var distance = _serie_type_edit_li.find("input[name=statslabeldistance]").val();
        var rotate = _serie_type_edit_li.find("input[name=statslabelrotate]").val();
        var chart_color = _serie_type_edit_li.find("input[name=statscolor]").val();

        if (distance === "" || distance === "undefined") {
            distance = 0;
        }

        if (rotate === "" || rotate === "undefined") {
            rotate = 0;
        }

        var scatter_character = _serie_type_edit_li.find("input[name=scattercharacter]").val();
        var scatter_matchname = _serie_type_edit_li.find("input[name=scattermatchname]").val();
        if (scatter_matchname === "" || scatter_matchname === "undefined") {
            scatter_matchname = f.colName;
        }
        $("#scatter-matchname").val(scatter_matchname);
        $("#scatter-character").val(scatter_character);

        if (type !== "") {
            $("#graph_type_select").val(type);
            $("#y_index").val(value_axis);
            $("#number_display_select").val(label_show);
            $("#stack").val(stack_name);
            $("#label-distance").val(distance);
            $("#label-rotate").val(rotate);
        }

        if (chart_color !== "") {
            $("#chart-color").val(chart_color);
        } else {
            $("#chart-color").val("#ffffff");
        }

        if (initType === "bar" || initType === "line") {
            $("#editSerieType").modal("show");
        } else if (initType === "scatter") {
            $("#editScatterSerieType").modal("show");
        } else {
            showInfoAlert("当前类型图表不支持样式调整！");
        }
    });

    li.append(li_icon);
    li.append(li_agg_icon);
    li.append(li_field);
    li.append(li_showname);
    li.append(li_del);
    li.append(li_add_compute);    //不启用此功能 by wangjunfu
    li.append(li_edit_serie_type);
    li.append(li_ul);

    //隐藏值设置
    var hide_field = $('<input type="hidden" name="statsfields" value="' + f.colName + '" />');
    var hide_fieldtype = $('<input type="hidden" name="statsfieldtypes" value="' + f.colType + '" />');
    var hide_aggtype = $('<input type="hidden" name="statsaggtypes" value="' + agg_type + '" />');

    //将新的样式控制加入隐藏值面板中（弹出Tab）
    var hide_yindex = $('<input type="hidden" name="statsyindex" value="' + yIdx + '" />');
    var hide_charttype = $('<input type="hidden" name="statscharttype" value="' + initType + '" />');
    var hide_showlabel = $('<input type="hidden" name="statsshowlabel" value="' + labShow + '" />');
    var hide_stack = $('<input type="hidden" name="statsstack" value="' + f.stack + '" />');
    var hide_distance = $('<input type="hidden" name="statslabeldistance" value="' + f.labelDistance + '" />');
    var hide_rotate = $('<input type="hidden" name="statslabelrotate" value="' + f.labelRotate + '" />');
    var hide_matchname = $('<input type="hidden" name="scattermatchname" value="' + f.scatterMatchName + '" />');
    var hide_character = $('<input type="hidden" name="scattercharacter" value="' + f.scatterCharacter + '" />');
    var set_color = "";
    if (f.chartColor) {
        set_color = f.chartColor;
    }
    var hide_color = $('<input type="hidden" name="statscolor" value="' + set_color + '" />');

    li.append(hide_field);
    li.append(hide_fieldtype);
    li.append(hide_charttype);
    li.append(hide_aggtype);
    li.append(hide_yindex);
    li.append(hide_showlabel);
    li.append(hide_stack);
    li.append(hide_distance);
    li.append(hide_rotate);
    li.append(hide_matchname);
    li.append(hide_character);
    li.append(hide_color);

    // 添加计算字段隐藏值 为空表示不是计算字段
    var mathod = "";
    var com_agg = "";
    var com_fname = "";
    var com_fnamecn = "";
    var com_ftype = "";
    if (f.method) {
        mathod = f.method;
        com_agg = f.comAgg;
        com_fname = f.comName;
        com_fnamecn = f.comNameCn;
        com_ftype = f.comType;
    }

    var hide_compute_method = $('<input type="hidden" name="com_method" value="' + mathod + '" />');
    var hide_compute_agg = $('<input type="hidden" name="com_agg" value="' + com_agg + '" />');
    var hide_compute_fname = $('<input type="hidden" name="com_fname" value="' + com_fname + '" />');
    var hide_compute_fsname = $('<input type="hidden" name="com_fnamecn" value="' + com_fnamecn + '" />');
    var hide_compute_ftype = $('<input type="hidden" name="com_ftype" value="' + com_ftype + '" />');

    // 不启用以下功能 by wangjunfu
    li.append(hide_compute_method);
    li.append(hide_compute_agg);
    li.append(hide_compute_fname);
    li.append(hide_compute_fsname);
    li.append(hide_compute_ftype);

    //点击选这统计类型
    $(li_agg_icon).click(function () {
        $(this).siblings("ul").toggle();
        //其他li中的ul关闭
        $(this).closest("li[name=statsfiled]").siblings("li").find("ul").hide();
    });

    $(li_field).click(function () {
        $(this).siblings("ul").toggle();
        //其他li中的ul关闭
        $(this).closest("li[name=statsfiled]").siblings("li").find("ul").hide();
    });

    //删除
    $(li_del).click(function () {
        $(this).closest("li[name=statsfiled]").remove();
    });

    //点击选择统计类型
    $(li_ul).find("li").click(function () {
        var icon_str = "icon-";
        var agg_type = $(this).data("aggtype");
        if (agg_type === "distinctcount") {
            icon_str = icon_str + "countd";
        } else {
            icon_str = icon_str + agg_type;
        }

        //保存选中值
        $(this).closest("li[name=statsfiled]").find("input[name=statsaggtypes]").val(agg_type);

        //修改显示图标
        $(this).closest("li[name=statsfiled]").find("span[name=aggtypeicon]").attr("class", 'iconfont ' + icon_str + ' icon-aggregate');

        //关闭选择
        $(this).closest("ul").hide();
    });
    $("#area_value").append(li);
}

/**
 * 创建分组字段Dom
 * @param f
 */
function createGroupColumn(f) {
    var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
    var chartstyle = chart_model_div.data("chartstyle");
    var groups = $("#area_group").find("li[name=groupfiled]");
    //当图表为pie时 只能有一个Group字段和统计字段
    if (chartstyle.type === 2 || chartstyle.type === 3 || chartstyle.type === 5 || chartstyle.type === 6 || chartstyle.type === 7) {
        if (groups.length > 2 && chartstyle.type === 2) {
            return showInfoAlert("饼图最多有两个分组字段！");
        }
        if (groups.length > 1 && chartstyle.type === 3) {
            return showInfoAlert("Map图只能有一个分组字段！");
        }
        if (groups.length > 2 && chartstyle.type === 5) {
            return showInfoAlert("环形图最多有两个分组字段！");
        }
        if (groups.length > 1 && chartstyle.type === 6) {
            return showInfoAlert("南丁格尔玫瑰图只能有一个分组字段！");
        }
        if (groups.length > 1 && chartstyle.type === 7) {
            return showInfoAlert("仪表盘只能有一个分组字段");
        }
    } else {
        if (groups.length > 2) {
            return showInfoAlert("图表最多有两个分组字段！");
        }
    }

    var li = $('<li name="groupfiled" class="column-item column-dim">');
    var icon_class = "string_ico_docu";
    switch (f.colType) {
        case "string":
            break;
        case "date":
        case "time":
            icon_class = "datetime_ico_docu";
            break;
        case "numeric":
            icon_class = "number_ico_docu";
            break;
        default:
            break;
    }
    var li_icon = $('<span  class="button ' + icon_class + '"></span>');
    var li_field = $('<span class="data-item data-dim-item" style="width: 0px;" title="' + f.colName + '(' + f.colNameCn + ')">' + f.colName + '</span>');
    var li_showname = $('<span class="data-item " style="width: 160px;margin-left: 1px;" ><input class="query-input" name="groupnames" value="' + f.colNameCn + '" type="text" /></span>');
    var li_del = $('<span title="移除分组字段" class="iconfont icon-remove pull-right"></span>');
    //隐藏值
    var hide_field = $('<input type="hidden" name="groupfields" value="' + f.colName + '" />');
    var hide_fieldtype = $('<input type="hidden" name="groupfieldtypes" value="' + f.colType + '" />');
    var hide_interval = $('<input type="hidden" name="groupintervals" value="' + f.interval + '" />');

    li.append(li_icon);
    li.append(li_field);
    li.append(li_showname);
    li.append(li_del);
    li.append(hide_field);
    li.append(hide_fieldtype);
    li.append(hide_interval);
    //删除
    $(li_del).click(function () {
        $(this).closest("li[name=groupfiled]").remove();
    });

    $("#area_group").append(li);
}

/**
 * 创建图例字段Dom
 * @param f
 */
function createLegendColumn(f) {
    //图例只能放一个
    var legends = $("#area_legend").find("li[name=legendfiled]");
    if (legends.length >= 1) {
        return showInfoAlert("图例字段只能有一个！");
    }
    //当统计字段有两个及以上时 不能再添加图例字段
    var values = $("#area_value").find("li[name=statsfiled]");
    if (values.length > 1) {
        return showInfoAlert("统计字段超过一个，不能添加图例字段！");
    }
    var li = $('<li name="legendfiled" class="column-item column-dim" >');
    var icon_class = "string_ico_docu";
    switch (f.colType) {
        case "string":
        case "enum":
            break;
        case "date":
        case "time":
            icon_class = "datetime_ico_docu";
            break;
        case "numeric":
            icon_class = "number_ico_docu";
            break;
        default:
            break;
    }

    var li_icon = $('<span  class="button ' + icon_class + '"></span>');
    var li_field = $('<span class="data-item data-dim-item" style="width: 0px;" title="' + f.colName + '(' + f.colNameCn + ')">' + f.colName + '</span>');
    var li_showname = $('<span class="data-item " style="width: 160px;margin-left: 1px;" ><input class="query-input" name="legendnames" value="' + f.colNameCn + '" type="text" /></span>');
    var li_del = $('<span title="移除图例字段" class="iconfont icon-remove pull-right"></span>');
    //隐藏值
    var hide_field = $('<input type="hidden" name="legendfields" value="' + f.colName + '" />');
    var hide_fieldtype = $('<input type="hidden" name="legendfieldtypes" value="' + f.colType + '" />');
    var hide_interval = $('<input type="hidden" name="legendintervals" value="' + f.interval + '" />');

    li.append(li_icon);
    li.append(li_field);
    li.append(li_showname);
    li.append(li_del);
    li.append(hide_field);
    li.append(hide_fieldtype);
    li.append(hide_interval);
    //删除
    $(li_del).click(function () {
        $(this).closest("li[name=legendfiled]").remove();
    });

    $("#area_legend").append(li);
}

var _compute_stats_li;  //当前要添加计算字段的stats列
/**
 * 添加计算字段
 */
function addComputeField() {
    var method = $("#compute_method_select").val();
    var agg = $("#compute_agg_select").val();
    var fname = $("#compute_field_select").val();
    var field = _meta_col_map[fname];

    if (method === "") {
        _compute_stats_li.find("input[name=com_method]").val("");
        _compute_stats_li.find("input[name=com_agg]").val("");
        _compute_stats_li.find("input[name=com_fname]").val("");
        _compute_stats_li.find("input[name=com_fnamecn]").val("");
        _compute_stats_li.find("input[name=com_ftype]").val("");
    } else {
        _compute_stats_li.find("input[name=com_method]").val(method);
        _compute_stats_li.find("input[name=com_agg]").val(agg);
        _compute_stats_li.find("input[name=com_fname]").val(field.colName);
        _compute_stats_li.find("input[name=com_fnamecn]").val(field.colNameCn);
        _compute_stats_li.find("input[name=com_ftype]").val(field.colType);
    }
    $("#addComputeField").modal("hide");
}

var current_eidt_filter_dom;
/**
 * 创建过滤器Dom
 * @param trme_str
 * @param fname
 * @param fieldtype
 * @param fvalue
 * @param ftype
 * @param fromvalue
 * @param tovalue
 */
function createFilterDom(trme_str, fname, fnamecn, fieldtype, fvalue, ftype, fromvalue, tovalue) {
    var filter_div = $("#filter_list_div");
    var icon_class = "string_ico_docu";
    switch (fieldtype) {
        case "string":
            break;
        case "enum":
            break;
        case "date":
        case "datetime":
            icon_class = "datetime_ico_docu";
            break;
        case "numeric":
            icon_class = "number_ico_docu";
            break;
        case "text":
            icon_class = "text_ico_docu";
            break;
        default:
            break;
    }

    var f_li = $('<li name="filterfield" class="column-item column-dim" title="' + trme_str + '"> ');
    var f_li_icon = $('<span class="button ' + icon_class + '"></span>');
    var f_li_trme = $('<span class="node_name" style="padding-left: 15px;">' + trme_str + '</span>');
    var f_li_ficon = $('<span class="iconfont icon-edit pull-right highlight"></span>');
    var f_li_rm = $('<span title="移除过滤条件" class="iconfont icon-remove pull-right"></span>');

    $(f_li_rm).click(function () {
        $(this).closest("li[name=filterfield]").remove();
    });

    $(f_li_ficon).click(function () {
        //编辑过滤条件
        var pli = $(this).closest("li[name=filterfield]");
        var fn = pli.find("input[name=filterfield]").val();
        var fcn = pli.find("input[name=filterfieldcn]").val();
        var ft = pli.find("input[name=filterftypes]").val();
        var ftv = pli.find("input[name=textvalues]").val();
        var flt = pli.find("input[name=filtertype]").val();
        var ffromv, ftov;
        if (pli.find("input[name=fromvalues]").length > 0) {
            ffromv = pli.find("input[name=fromvalues]").val();
            ftov = pli.find("input[name=tovalues]").val();
        }
        editFilter(this, fn, fcn, ft, flt, ftv, ffromv, ftov);
    });

    f_li.append(f_li_icon);
    f_li.append(f_li_trme);
    f_li.append(f_li_rm);
    f_li.append(f_li_ficon);

    //提交input构建
    var input_fname = $('<input type="hidden" name="filterfield" value="' + fname + '" />');
    var input_fnamecn = $('<input type="hidden" name="filterfieldcn" value="' + fnamecn + '" />');
    var input_fieldtype = $('<input type="hidden" name="filterftypes" value="' + fieldtype + '" />');
    var input_fvalues = $('<input type="hidden" name="textvalues" value="' + fvalue + '" />');
    var input_ftype = $('<input type="hidden" name="filtertype" value="' + ftype + '" />');

    f_li.append(input_fname);
    f_li.append(input_fnamecn);
    f_li.append(input_fieldtype);
    f_li.append(input_fvalues);
    f_li.append(input_ftype);

    if (fromvalue) {
        var input_fromvalue = $('<input type="hidden" name="fromvalues" value="' + fromvalue + '" />');
        var input_tovalue = $('<input type="hidden" name="tovalues" value="' + tovalue + '" />');
        f_li.append(input_fromvalue);
        f_li.append(input_tovalue);
    }
    filter_div.append(f_li);
    if (current_eidt_filter_dom) {
        //编辑条件 移除后新增
        $(current_eidt_filter_dom).remove();
    }
}

/**
 * 编辑过滤器
 * @param fname
 * @param fieldtype
 * @param fvalue
 * @param ftype
 * @param fromvalue
 * @param tovalue
 */
function editFilter(target, fname, showname, fieldtype, ftype, fvalue, fromvalue, tovalue) {
    var f = {};
    f.colName = fname;
    f.colNameCn = showname;
    f.colType = fieldtype;
    current_eidt_filter_dom = $(target).closest("li[name=filterfield]");

    switch (fieldtype) {
        case "string":
        case "enum":
            showStringFilterModal(f);
            if (ftype == "in" || ftype == "notIn") {    //in 和 notIn 条件
                $("#string_in_notin_select").val(ftype);
                $("#string_tab_in").tab("show");
                _string_term_type = "in";
                //还原值
                if (fvalue.indexOf(",") >= 0) {
                    var arr_v = fvalue.split(",");
                    $.each(arr_v, function (i, v) {
                        if (v != "") {
                            $("#field_choose_values_select").append("<option ondblclick=' dbClickAddOrRemove(this)' value='" + v + "'>" + v + "</option>");
                        }
                    });
                } else {
                    $("#field_choose_values_select").append("<option ondblclick=' dbClickAddOrRemove(this)' value='" + fvalue + "'>" + fvalue + "</option>");
                }
            } else if (ftype == "equal" || ftype == "notEqual") {   //等值条件
                $("#string_equal_notequal_select").val(ftype);
                _string_term_type = "equal";
                $("#string_tab_equal").tab("show");
                $("#stringEqualInput").val(fvalue);
            } else if (ftype == "like" || ftype == "notLike") {     //模糊匹配条件
                $("#string_like_notlike_select").val(ftype);
                _string_term_type = "like";
                $("#string_tab_like").tab("show");
                $("#stringLikeInput").val(fvalue);
            }
            break;
        case "date":
            var isAbsolute = true;          //是否绝对条件

            if (!fromvalue) {
                fromvalue = ""
            }
            if (!tovalue) {
                tovalue = ""
            }
            if (fvalue.indexOf("T") == 0 || fromvalue.indexOf("T") == 0 || tovalue.indexOf("T") == 0) {
                isAbsolute = false;
            }

            if (ftype == "range") {         //range 条件
                showDateFilterRange();
                if (isAbsolute) {
                    $("#absoluteStartDate").val(fromvalue);
                    $("#absoluteEndDate").val(tovalue);
                } else {
                    $("#relativeStartDate").val(fromvalue.replace("T", ""));
                    $("#relativeEndDate").val(tovalue.replace("T", ""));
                }
            } else if (ftype == "equal") {  //等值条件
                showDateFilterEqual();

                if (isAbsolute) {
                    $("#datepicker-autoclose").val(fvalue);
                } else {
                    $("#relativeStartDate").val(fvalue.replace("T", ""));
                }
            }

            if (isAbsolute) {
                showDateFilterAbsolute();
            } else {
                showDateFilterRelative();
            }

            showDateFilterModal(f);
            break;
        case "datetime":
        case "numeric":
            showNumberFilterModal(f);
            if (ftype == "range") {         //range 条件
                showNumberFilterRange();
                $("#numberFilterStartInput").val(fromvalue);
                $("#numberFilterEndInput").val(tovalue);
            } else if (ftype == "equal") {  //等值条件
                showNumberFilterEqual();
                $("#numberFilterInput").val(fvalue);
            }
            break;
    }
}

/**
 * 图表元素添加缩放功能
 * @param target
 */
function addResizable(target) {
    $(target).resizable({
        maxWidth: 1366,
        minWidth: 250,
        grid: 20,
        stop: function (e, ui) {
            //设定大小
            var target_width = $(ui.element).width();//当前宽度
            var target_height = $(ui.element).height();//当前高度
            var parent_width = $(ui.element).parent().width();//父元素宽
            var width_class = "";
            var bili = target_width / parent_width * 100;
            if (bili > 92) {
                width_class = "col-lg-12";
            } else if (bili > 84) {
                width_class = "col-lg-11";
            }
            else if (bili > 75) {
                width_class = "col-lg-10";
            }
            else if (bili > 67) {
                width_class = "col-lg-9";
            }
            else if (bili > 59) {
                width_class = "col-lg-8";
            }
            else if (bili > 50) {
                width_class = "col-lg-7";
            }
            else if (bili > 42) {
                width_class = "col-lg-6";
            }
            else if (bili > 34) {
                width_class = "col-lg-5";
            }
            else if (bili > 25) {
                width_class = "col-lg-4";
            }
            else {
                width_class = "col-lg-3";
            }
            $(ui.element).css("width", "");
            $(ui.element).attr("class", "portlet " + width_class);
            var chartstyle = $(ui.element).data("chartstyle");
            //保存宽高设置
            chartstyle.width = width_class;
            chartstyle.height = target_height;
            $(ui.element).data("chartstyle", chartstyle);
            updateChartInfo(chartstyle);//更新数据库
            var chart_dom = $(ui.element).find("div[name=chartdiv]");
            var chart = echarts.init(chart_dom.get(0));
            chart.resize();
        }
    });
}

/**
 * 创建图表画布
 * @param ctype
 */
function createChartDiv(ctype) {
    var d_height = 300;
    var d_width = "col-lg-12";
    var div = $('<div name="chart_model_div" class="' + d_width + ' portlet select_chart_div" style="border:1px solid #ccc;height: ' + d_height + 'px">');
    var div_title = $('<div class="portlet-heading portlet-default" style="padding: 5px 20px">\n'
        + '    <h3 name="chart_title" class="portlet-title text-dark">\n'
        + '        请输入图表名称\n'
        + '    </h3>\n'
        + '    <div class="portlet-widgets">\n'
        + '        <a href="#" onclick="removeChartInfo(this)" ><i class="ion-close-round"></i></a>\n'
        + '    </div>\n'
        + '    <div class="clearfix"></div>\n'
        + '</div>');
    var div_chart = $('<div class="panel-collapse collapse in" style="width: 100%;height: calc(100% - 55px);">\n'
        + '    <div class="portlet-body" style="width: 100%;height: 100%;padding: 0 5px 0 0">\n'
        + '        <div name="chartdiv" style="width: 100%;height: 100%;min-height: 200px;">\n'
        + '        </div>\n'
        + '    </div>\n'
        + '</div>');
    div.append(div_title);
    div.append(div_chart);
    $("#widget-chart-container").append(div);
    $(div).siblings("div[name=chart_model_div]").removeClass("select_chart_div");

    current_chart = echarts.init(div_chart.find("div[name=chartdiv]").get(0));
    page_charts_array.push(current_chart);

    var chart_option = lineChartOptions();
    switch (ctype) {
        case 0: //拆线图
            chart_option = lineChartOptions();
            break;
        case 1: //柱图
            chart_option = barChartOption();
            break;
        case 2: //饼图
            chart_option = pieChartOption();
            break;
        case 3: //地图
            chart_option = mapChartOption();
            break;
        case 4: //漏斗图
            chart_option = funnelChartOption();
            break;
        case 5: //环形图
            chart_option = doughnutChartOption();
            break;
        case 6: //南丁格尔玫瑰图
            chart_option = nightingaleRoseChartOption();
            break;
        case 7: //仪表盘
            chart_option = gaugeChartOption();
            break;
        case 8: //散点图
            chart_option = scatterChartOption();
            break;
        default:
            chart_option = lineChartOptions();
            break
    }
    current_chart.setOption(chart_option);

    //添加缩放功能
    addResizable(div);

    //点击事件添加
    addClickEvent(div);

    //显示属性编辑区 并初始化属性
    $("#widget-config").show();
    var idx = $("#widget-chart-container").find("div[name=chart_model_div]").length - 1;
    var chartstyle = {
        index: idx,
        type: ctype,
        height: d_height,
        width: d_width,
        title: '请输入图表名称',
        is_show_title: 1,
        orient: 1,
        doubleY: 0,
        graph: 0,
        is_show_legend: 1,
        legend_position: 'top',
        is_show_tips: 1,
        specialAttribute: ''
    };
    $(div).data("chartstyle", chartstyle);
    intiStyle(chartstyle);

    //清空字段设置区域
    $("#area_value").empty();
    $("#area_group").empty();
    $("#area_legend").empty();
    $("#filter_list_div").empty();
    saveChartInfo(div);//保存图表信息
}

/**
 * 创建过滤器显示字段
 * @param filter
 */
function createFilterTremStr(filter) {
    var str = "";
    switch (filter.filtertype) {
        case "in":
            str = filter.field + " in (" + filter.value + ") ";
            break;
        case "notIn":
            str = filter.field + " not in (" + filter.value + ") ";
            break;
        case "range":
            if (filter.fromvalue && filter.fromvalue.length > 0 && filter.tovalue && filter.tovalue.length > 0) {
                str = filter.field + " >= " + filter.fromvalue + " and  " + filter.field + " <= " + filter.tovalue + " ";
            } else if (filter.fromvalue && filter.fromvalue.length > 0) {
                str = filter.field + " >= " + filter.fromvalue + " ";
            } else if (filter.tovalue && filter.tovalue.length > 0) {
                str = filter.field + " <= " + filter.tovalue + " ";
            }
            break;
        case "equal":
            str = filter.field + " = " + filter.value + " ";
            break;
        case "notEqual":
            str = filter.field + " != " + filter.value + " ";
            break;
        case "like":
            str = filter.field + " like " + filter.value + " ";
            break;
        case "notLike":
            str = filter.field + " like " + filter.value + " ";
            break;

    }
    return str;
}

/**
 * 添加点击事件
 * @param target
 */
function addClickEvent(target) {
    $(target).click(function () {
        $(this).addClass("select_chart_div");
        $(this).siblings("div[name=chart_model_div]").removeClass("select_chart_div");
        current_chart = echarts.init($(this).find("div[name=chartdiv]").get(0));

        //右侧属性版修改
        var chartstyle = $(this).data("chartstyle");
        intiStyle(chartstyle);

        //数据字段属性
        var statsfields = $(this).data("statsfields");
        $("#area_value").empty();
        if (statsfields) {
            $.each(statsfields, function (i, f) {
                createStatsColumn(f);
            });
        }

        var groupfields = $(this).data("groupfields");
        $("#area_group").empty();
        if (groupfields) {
            $.each(groupfields, function (i, f) {
                createGroupColumn(f);
            });
        }

        var legendfields = $(this).data("legendfields");
        $("#area_legend").empty();
        if (legendfields) {
            $.each(legendfields, function (i, f) {
                createLegendColumn(f);
            });
        }

        var filterfields = $(this).data("filterfields");
        $("#filter_list_div").empty();
        if (filterfields) {
            $.each(filterfields, function (i, f) {
                //trme_str,fname,fnamecn,fieldtype,fvalue,ftype,fromvalue,tovalue
                var trme_str = createFilterTremStr(f);
                var fname = f.field;
                var fnamecn = f.namecn;
                var fieldtype = f.fieldtype;
                var fvalue = f.value;
                var ftype = f.filtertype;
                var fromvalue = f.fromvalue;
                var tovalue = f.tovalue;
                createFilterDom(trme_str, fname, "", fieldtype, fvalue, ftype, fromvalue, tovalue);
            });
        }

        //显示属性编辑区 并初始化属性
        $("#widget-config").show();
    });
}

/**
 * 移除图表
 * @param target
 */
function removeChartInfo(target) {
    var rdiv = $(target).closest("div[name=chart_model_div]");
    var chartstyle = rdiv.data("chartstyle");

    showInfoAlertSelect("确定要删除[" + chartstyle.title + "]图表吗？", function () {
        if (chartstyle.id) {

            // 区分"数据图表"还是"高级图表"
            var url = "/analysis/composechart/removeChartInfo";
            if ($("input[name='submitChartType']").val() == 1){
                url = "/analysis/charts/removeChartInfo";
            }

            ajax({
                url: url,
                data: {chartinfoid: chartstyle.id},
                success: function (result) {
                    if (result.returnCode == 1) {
                        rdiv.remove();
                        return showInfoAlert("删除[" + chartstyle.title + "]图表信息成功！");
                    } else {
                        return showInfoAlert("删除[" + chartstyle.title + "]图表信息失败！");
                    }
                }
            });
        } else {
            rdiv.remove();
            return showInfoAlert("删除[" + chartstyle.title + "]图表信息成功！");
        }
    });
}

/**
 * 图表操作界面 可视化操作面板中 数据和样式tabs切换功能
 * @param target
 * @param id
 */
function configTabsShow(target, id) {
    $(target).addClass("active");
    $(target).siblings().removeClass("active");
    $("#config-data-div").addClass("hide");
    $("#config-style-div").addClass("hide");
    $("#" + id).removeClass("hide");
}

/**
 * 执行查询
 */
function execQuery() {
    //把查询信息绑定到chart_div 上
    var statsfields = [];
    $("#queryform").find("li[name=statsfiled]").each(function (i, li) {
        var tli = $(li);
        var fieldname = tli.find("input[name=statsfields]").val();
        var fieldshowname = tli.find("input[name=statsnames]").val();
        var fieldtype = tli.find("input[name=statsfieldtypes]").val();
        var aggtype = tli.find("input[name=statsaggtypes]").val();
        var charttype = tli.find("input[name=statscharttype]").val();
        var value_axis = tli.find("input[name=statsyindex]").val();
        var label_show = tli.find("input[name=statsshowlabel]").val();
        var data_stack = tli.find("input[name=statsstack]").val();
        var label_distance = tli.find("input[name=statslabeldistance]").val();
        var label_rotate = tli.find("input[name=statslabelrotate]").val();
        var chart_color = tli.find("input[name=statscolor]").val();
        var scatter_character = tli.find("input[name=scattercharacter]").val();
        var scatter_matchname = tli.find("input[name=scattermatchname]").val();

        // 以下5个为计算字段 此功能不启用 by wangjunfu
        var method = tli.find("input[name=com_method]").val();
        var com_name = tli.find("input[name=com_fname]").val();
        var com_namecn = tli.find("input[name=com_fnamecn]").val();
        var com_type = tli.find("input[name=com_ftype]").val();
        var com_agg = tli.find("input[name=com_agg]").val();

        if (!value_axis) {
            value_axis = 0;
        }
        if (label_distance === "" || label_distance === "undefined" || !label_distance) {
            label_distance = 0;
        }
        if (label_rotate === "" || label_rotate === "undefined" || !label_rotate) {
            label_rotate = 0;
        }

        var sf = {};
        sf.aggtype = aggtype;
        sf.colName = fieldname;
        sf.colNameCn = fieldshowname;
        sf.colType = fieldtype;
        sf.chartType = charttype;
        sf.yIndex = value_axis;
        sf.isLabelShowed = label_show;
        sf.stack = data_stack;
        sf.labelDistance = label_distance;
        sf.labelRotate = label_rotate;
        sf.chartColor = chart_color;
        sf.scatterMatchName = scatter_matchname;
        sf.scatterCharacter = scatter_character;
        sf.method = method;
        sf.comName = com_name;
        sf.comNameCn = com_namecn;
        sf.comType = com_type;
        sf.comAgg = com_agg;
        statsfields.push(sf);
    });

    var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
    chart_model_div.data("statsfields", statsfields);
    var groupfields = [];
    $("#queryform").find("li[name=groupfiled]").each(function (i, li) {
        var tli = $(li);
        var fieldname = tli.find("input[name=groupfields]").val();
        var fieldshowname = tli.find("input[name=groupnames]").val();
        var fieldtype = tli.find("input[name=groupfieldtypes]").val();
        var interval = tli.find("input[name=groupintervals]").val();
        var sf = {};
        sf.interval = interval;
        sf.colName = fieldname;
        sf.colNameCn = fieldshowname;
        sf.colType = fieldtype;
        groupfields.push(sf);
    });
    chart_model_div.data("groupfields", groupfields);

    var legendfields = [];
    $("#queryform").find("li[name=legendfiled]").each(function (i, li) {
        var tli = $(li);
        var fieldname = tli.find("input[name=legendfields]").val();
        var fieldshowname = tli.find("input[name=legendnames]").val();
        var fieldtype = tli.find("input[name=legendfieldtypes]").val();
        var interval = tli.find("input[name=legendintervals]").val();
        var sf = {};
        sf.interval = interval;
        sf.colName = fieldname;
        sf.colNameCn = fieldshowname;
        sf.colType = fieldtype;
        legendfields.push(sf);
    });
    chart_model_div.data("legendfields", legendfields);

    var filterfields = [];
    $("#queryform").find("li[name=filterfield]").each(function (i, li) {
        var tli = $(li);
        var fieldname = tli.find("input[name=filterfield]").val();
        var fieldnamecn = tli.find("input[name=filterfieldcn]").val();
        var fieldtype = tli.find("input[name=filterftypes]").val();
        var textvalues = tli.find("input[name=textvalues]").val();
        var filtertype = tli.find("input[name=filtertype]").val();
        var fromvalues = tli.find("input[name=fromvalues]").val();
        var tovalues = tli.find("input[name=tovalues]").val();
        var sf = {};
        sf.field = fieldname;
        sf.namecn = fieldnamecn;
        sf.fieldtype = fieldtype;
        sf.value = textvalues;
        sf.filtertype = filtertype;
        sf.fromvalue = fromvalues;
        sf.tovalue = tovalues;
        filterfields.push(sf);
    });
    chart_model_div.data("filterfields", filterfields);

    current_chart.showLoading();
    var tablename = $("#tablename").val();
    var sourceId = $("#sourceId").val();
    var size = $("#pagesize").val();
    var chart_type = $("#charttype").val();
    var statsjson_str = JSON.stringify(statsfields);
    var groupjson_str = JSON.stringify(groupfields);
    var legendjson_str = JSON.stringify(legendfields);
    var filterjson_str = JSON.stringify(filterfields);
    var chartstyle = chart_model_div.data("chartstyle");

    var postData = {
        tablename: tablename,
        sourceId: sourceId,
        composeId: sourceId,
        page: 1,
        pageSize: size,
        doubleY: chartstyle.doubleY,
        chartType: chart_type,
        statsjson: statsjson_str,
        groupjson: groupjson_str,
        legendjson: legendjson_str,
        fliterjson: filterjson_str
    };

    var modifyData = {
        id: chartstyle.id,
        chartinfoid: chartstyle.chartinfoid,
        chartid: chartstyle.chartid,
        statsjson: statsjson_str,
        groupjson: groupjson_str,
        legendjson: legendjson_str,
        fliterjson: filterjson_str
    };

    // 区分"数据图表"还是"高级图表"
    var url = "/analysis/composechart/execChartQuery";
    if ($("input[name='submitChartType']").val() == 1){
        url = "/analysis/charts/execChartQuery";
    }

    ajax({
        url: url,
        data: postData,
        success: function (result) {
            if (result.returnCode == 1) {
                var page = result.page;
                var rows = page.items;
                if (rows.length > 0) {
                    //数据信息
                    var chartinfo = result.chartinfo;
                    handlerChartDatas(chartinfo);
                    current_chart.hideLoading();

                    //图表id不为空时更新数据库
                    if (modifyData.id) {
                        updateChartInfo(modifyData);
                    }
                } else {
                    return showInfoAlert("没有查询到记录！", null);
                }
            }
        }
    });
}

/**
 * 将查询到的数据填充到图表
 * @param chartinfo
 */
function handlerChartDatas(chartinfo) {
    var chart_model_div = $(current_chart.getDom()).closest("div[name=chart_model_div]");
    var chartstyle = chart_model_div.data("chartstyle");
    var legends = chartinfo.legend;
    var series = chartinfo.series;
    var xaxis = chartinfo.xAxis;
    var chart_options = current_chart.getOption();
    var visualMap1 = chartinfo.visualMaps;

    if (chartstyle.type === 7) {
        var size = chartinfo.size;
        var number = chartinfo.number;
        var value = chartinfo.value;

        if (size !== 1) {
            showInfoAlert("统计字段只能是一个数字，当前有【" + size + "】个数字！");
        }
        if (number > 1.0) {
            showInfoAlert("统计字段只能是0-1之间的数字，当前值是【" + number + "】！");
        }
    }

    if (chart_options) {
        if (chartstyle.charttype === 0 || chartstyle.charttype === 1) {
            chart_options.xAxis.boundaryGap = true;
        }
        if (chartstyle.type === 3) {
            chart_options.dataRange = visualMap1;
        }
        if (xaxis) {
            // 判断下当前图表是纵向还是横向
            if (chartstyle.orient === 1) {
                chart_options.xAxis[0].data = xaxis;

                // 饼图和柱图判断是否双Y轴
                if (chartstyle.doubleY === 1) { //双Y轴
                    chart_options.yAxis = [{type: 'value'}, {type: 'value'}];
                } else {
                    chart_options.yAxis = [{type: 'value'}];
                }
            } else {
                chart_options.yAxis[0].data = xaxis;
            }
        }
        if (chartstyle.type !== 7) {
            if (chart_options.legend) {
                chart_options.legend[0].data = legends;
            } else {
                chart_options.legend = [];
                chart_options.legend[0] = {};
                chart_options.legend[0].data = legends;
            }
        }
    } else {
        // 获取初始化的图表options
        chart_options = lineChartOptions();
        if (chartstyle.type === 0) {
            chart_options = lineChartOptions();
        } else if (chartstyle.type === 1) {
            chart_options = barChartOption();
        } else if (chartstyle.type === 2) {
            chart_options = pieChartOption();
        } else if (chartstyle.type === 3) {
            chart_options = mapChartOption();
        } else if (chartstyle.type === 4) {
            chart_options = funnelChartOption();
        } else if (chartstyle.type === 5) {
            chart_options = doughnutChartOption();
        } else if (chartstyle.type === 6) {
            chart_options = nightingaleRoseChartOption();
        } else if (chartstyle.type === 7) {
            chart_options = gaugeChartOption();
        } else if (chartstyle.type === 8) {
            chart_options = scatterChartOption();
        }
        if (xaxis) {
            // 判断下当前图表是纵向还是横向
            if (chartstyle.orient === 1) {
                chart_options.xAxis.data = xaxis;
                // 饼图和柱图判断是否双Y轴
                if (chartstyle.doubleY === 1) { //双Y轴
                    chart_options.yAxis = [{type: 'value'}, {type: 'value'}];
                }
            } else {
                chart_options.yAxis.data = xaxis;
            }
        }
        chart_options.legend.data = legends;
    }
    chart_options.series = addSeriesDefaultOption(series, chartstyle.type);
    current_chart.setOption(chart_options, true);
}

/**
 * 保存数据图表数据
 */
function saveChart() {
    showmodalmethod(null);  //显示遮罩层

    var chartid = $("#chartid").val();
    var chartname = $("#chartname").val();
    var sourceId = $("#sourceId").val();
    var postData = {
        chartid: chartid,
        chartname: chartname,
        sourceId: sourceId,
        composeid: sourceId
    };

    // 区分"数据图表"还是"高级图表"
    var url = "/analysis/composechart/saveChart";
    if ($("input[name='submitChartType']").val() == 1){
        url = "/analysis/charts/saveChart";
    }

    ajax({
        url: url,
        data: postData,
        success: function (result) {
            if (result.returnCode == 1) {
                //返回的主键信息保存到界面
                $("#chartid").val(result.chartid);
                if (!chartid) {         //新增时需要保存下图表数据
                    $("#widget-chart-container").find("div[name=chart_model_div]").each(function (i, div) {
                        saveChartInfo(div);
                    });
                }
                canclemodalmethod();    //取消遮罩层
            } else {
                canclemodalmethod();    //取消遮罩层
                canclemodalmethod();    //取消遮罩层
                showInfoAlert("保存数据图表信息失败！");
            }
        }
    });
}

/**
 * 保存数据图表中的子图表信息
 * @param chartmodeldiv
 */
function saveChartInfo(chartmodeldiv) {
    var chartid = $("#chartid").val();
    if (!chartid) {
        //还未保存主表
        return;
    }

    var sourceId = $("#sourceId").val();
    var chartstyle = $(chartmodeldiv).data("chartstyle");
    var statsfields = $(chartmodeldiv).data("statsfields");
    var groupfields = $(chartmodeldiv).data("groupfields");
    var legendfields = $(chartmodeldiv).data("legendfields");
    var filterfields = $(chartmodeldiv).data("filterfields");

    var chartstyle_str = JSON.stringify(chartstyle);
    var statsjson_str = JSON.stringify(statsfields);
    var groupjson_str = JSON.stringify(groupfields);
    var legendjson_str = JSON.stringify(legendfields);
    var filterjson_str = JSON.stringify(filterfields);

    var postData = {
        sourceId: sourceId,
        composeid: sourceId,
        chartid: chartid,
        chartstyle: chartstyle_str,
        statsjson: statsjson_str,
        groupjson: groupjson_str,
        legendjson: legendjson_str,
        fliterjson: filterjson_str,

    };

    // 区分"数据图表"还是"高级图表"
    var url = "/analysis/composechart/saveChartInfo";
    if ($("input[name='submitChartType']").val() == 1){
        url = "/analysis/charts/saveChartInfo";
    }

    ajax({
        url: url,
        data: postData,
        success: function (result) {
            if (result.returnCode == 1) {
                chartstyle.id = result.infoid;
                chartstyle.chartid = chartid;
                chartstyle.chartinfoid = result.infoid;
                $(chartmodeldiv).data("chartstyle", chartstyle);
            } else {
                return showInfoAlert("保存[" + chartstyle.title + "]图表信息失败！");
            }
        }
    });
}


/**
 * 保存数据图表中的图表信息
 * @param chartmodeldiv
 */
function updateChartInfo(chartstyle) {
    var chartinfoid = chartstyle.id;
    if (!chartinfoid) {
        //还未保存不进行数据库更新
        return;
    }

    // 区分"数据图表"还是"高级图表"
    var url = "/analysis/composechart/modifyChartInfo";
    if ($("input[name='submitChartType']").val() == 1){
        url = "/analysis/charts/modifyChartInfo";
    }

    ajax({
        url: url,
        data: chartstyle,
        success: function (result) {
            if (result.returnCode == 1) {
                //todo
            } else {
                return showInfoAlert("修改[" + chartstyle.title + "]图表信息失败！");
            }
        }
    });
}

/**
 * 查询预览
 * @returns {*}
 */
function previewChart() {
    var chartid = $("#chartid").val();
    if (!chartid) {
        return showInfoAlert("请先保存数据图表再进行预览！");
    }

    if ($("input[name='submitChartType']").val() == 1) {
        window.open("/analysis/charts/preview?chartid=" + chartid);
    } else {
        window.open("/analysis/composechart/preview?chartid=" + chartid);
    }
}

/**
 * 保存更改的统计字段样式（弹出Tab）
 */
var color_flag = true;      //颜色是否为默认
function editSerieType() {
    var type = $("#graph_type_select").val();
    var value_axis = $("#y_index").val();
    var label_show = $("#number_display_select").val();
    var data_stack = $("#stack").val();
    var label_distance = $("#label-distance").val();
    var label_rotate = $("#label-rotate").val();
    var chart_color = $("#chart-color").val();
    var scatter_matchname = $("#scatter-matchname").val();
    var scatter_character = $("#scatter-character").val();

    _serie_type_edit_li.find("input[name=statscharttype]").val(type);
    _serie_type_edit_li.find("input[name=statsyindex]").val(value_axis);
    _serie_type_edit_li.find("input[name=statsshowlabel]").val(label_show);
    _serie_type_edit_li.find("input[name=statsstack]").val(data_stack);
    _serie_type_edit_li.find("input[name=statslabeldistance]").val(label_distance);
    _serie_type_edit_li.find("input[name=statslabelrotate]").val(label_rotate);
    _serie_type_edit_li.find("input[name=scattercharacter]").val(scatter_character);
    _serie_type_edit_li.find("input[name=scattermatchname]").val(scatter_matchname);

    if (chart_color !== "" && color_flag === false) {
        _serie_type_edit_li.find("input[name=statscolor]").val(chart_color);
    } else {
        _serie_type_edit_li.find("input[name=statscolor]").val("");
    }

    if (type === "scatter") {
        $("#editScatterSerieType").modal("hide");
    } else {
        $("#editSerieType").modal("hide");
    }
}

/**
 * 设置非默认颜色
 */
function setColor() {
    color_flag = false;
}

/**
 * 将颜色设置成默认颜色
 */
function setDefaultColor() {
    var color = "#ffffff";

    _serie_type_edit_li.find("input[name=statscolor]").val(color);
    $("#chart-color").val(color);

    color_flag = true;
}


///=============== param start =========================

/**
 * 个性化定制Tab 保存完毕以后是Json格式
 */
function specialParams() {
    var params = $("input[name='specialAttribute']").val();  //页面属性

    var chart_model_div = $("#widget-chart-container").find(".select_chart_div");
    var chartstyle = chart_model_div.data("chartstyle");
    if (chartstyle.id == undefined){
        return showInfoAlert("请先保存数据图表再进行定制！");
    }

    var chartinfo_id = chartstyle.id;
    var submit_charttype = $("input[name='submitChartType']").val();

    $.ajax({
        url: "/analysis/charts/specialparam",
        type: "POST",
        data: {chartInfoId: chartinfo_id, submitChartType: submit_charttype, params: params},
        async: false,
        error: function (request) {
            //error
        },
        success: function (data) {
            $('#special-param-modal').html(data);
            $("#special_params_modal").modal("show");
        }
    });
}

function setSpecialParams() {
    $.ajax({
        url: "/analysis/charts/setspecialparam",
        type: "POST",
        data: $('#sepecialParamForm').serializeArray(),
        async: false,
        error: function (request) {
            //error
        },
        success: function (data) {
            $("input[name='specialAttribute']").val(data);
            $("#special_params_modal").modal("hide");
        }
    });
}

///=============== param end =========================